<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>推广注册</title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
				box-sizing: border-box;
			}
			html,body{
				height: 100%;
				margin: 0;
				padding: 0;
				font-size: 14px;
			}
			@media screen and (max-width:320px ) {
   				html{font-size: 12px;}
			}
			@media screen and (min-width:321px) and (max-width:750px ) {
			    html{font-size: 14px;}
			}
			@media screen and (min-width:751px ) {
			    html{font-size: 16px;}
			}
			body {
				background: #f86144 url('/dist/imgs/logo.png') no-repeat;
				background-size: 100% 100%;
			}
			.tui_bg {
				position: absolute;
				bottom: 0;
				left: 10%;
				width: 80%;
				margin: 1rem auto 2.4rem;
			}
			.tui_bg a {
				text-decoration: none;
				color: #df6534;
			}
			.tui_bg .input_block {
				margin-bottom: 1rem;
			}
			.tui_bg input {
				font-size: 1rem;
				width: 100%;
				height: 3rem;
				padding: 1rem 2rem;
				border: none;
				outline: none;
				border-radius: 1.5rem;
			}
			.tui_bg .two-line {
				position: relative;
			}
			.tui_bg .two-line a,img {
				position: absolute;
				right: 1rem;
				top: 0rem;
				line-height: 3rem;
			}
			.tui_bg .two-line a,img {
				position: absolute;
				right: 1rem;
				top: 0rem;
				line-height: 3rem;
			}
			.tui_bg .two-line img {
				width: 100px;
				height:36px;
			}
			.tui_bg .btn_acct {
				display: block;
				text-align: center;
				height: 3rem;
				line-height: 3rem;
				border-radius: 1.5rem;
				font-size: 1.3rem;
				background: #f8df61;
			}

		</style>
	</head>
	<body>
		<div class="tui_bg">
			<form action="#" method="post" id="formf">
				<section class="input_block">
					<input type="text" name="Mobile" id="Mobile" placeholder="请输入手机号" />
				</section>

				<section class="input_block two-line">
					<img src="{:url('admin/Login/verify')}" alt="" onclick='this.src=this.src+"?c="+Math.random()'/>
					<input id="code" name="MsgCode" type="text" placeholder="请输入图形验证码">
				</section>

				<section class="input_block two-line">
					<input id="MsgCode" name="MsgCode" type="text" placeholder="请输入短信验证码">
					<a href="javascript:void(0);" id="codeText" onclick="getcode()"> 获取验证码</a>
				</section>

				<input type="hidden" name="puser" id="puser" value="{$puser}">
			</form>
			<a class="input_block btn_acct" href="javascript:void(0);" onclick="fnRegister()">立即获取额度</a>
		</div>
		<script src="__CSS__/jquery/jquery-3.3.1.min.js"></script>
	</body>

</html>

<script src="__CSS__/layuiAdmin/layui/layui.js"></script>
<script src="__CSS__/jquery/jquery-3.3.1.min.js"></script>
<script src="http://cdn.highcharts.com.cn/highcharts/highcharts.js"></script>

<script>
	layui.config({
		base: '__CSS__/layuiAdmin/' //静态资源所在路径
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['index', 'console','sample']);
</script>

<script type="text/javascript">

	//注册
	function fnRegister() {
		$.ajax({
			type: "POST",
			url: "{:url('admin/login/register_tuiguang')}",
			data: $('#formf').serialize(),
			dataType: "json",
			success: function(res) {
				if(res.status == 1) {
					layer.msg(res.msg);
					window.setTimeout(function() {
						window.location.href = res.data.url;
					}, 2000);
				} else {
					layer.msg(res.msg);
				}
			}
		});
	}

	var isBtn = 1;//按钮可点击状态
	var time  = 60;//读秒时间值

	//获取验证码
	function getcode() {
		if(isBtn == 1){
			var mobile = $.trim($("#Mobile").val());
			var code   = $.trim($("#code").val());
			if(mobile == '') {
				layer.msg('手机号码不能为空');
				return;
			}
			if(code == ''){
				layer.msg('请输入图形验证码');
				return;
			}
			if(!mobile.match(/^((1[3-9][0-9]{1})+\d{8})$/)) {
				layer.msg('手机号码格式不正确');
				return;
			}
			$.ajax({
				type: 'post',
				url: "{:url('admin/login/sendVerify_regist')}",
				data: {
					mobile: mobile,
					check: 1,
					code:code,
				},
				dataType: 'json',
				success: function(res) {
					if(res.code == 520) {
						//弹出提示已注册，3秒后跳转至下载app页面
						layer.msg(res.msg);
						window.setTimeout(function() {
							window.location.href = res.data.url;
						}, 2000);
					}else if(res.code == 500) {
						layer.msg(res.msg);
					}else {
						setTime();
						layer.msg(res.msg);
					}
				}
			});
		}
	}

	//读秒
	function setTime(){
		isBtn = 0;
		timer = setInterval(function(){
			time--;
			if(time <= 0){
				isBtn = 1;
				time = 60;
				clearInterval(timer);
				$("#codeText").text('获取验证码');
			}else{
				var str = time + "s后重发";
				$("#codeText").text(str);
			}
		},1000);
	}
</script>